<!-- Modal Confirm -->
<div class="modal fade" id="modal_confirm_del_user" data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title">Confirm Deletion</h4>
			</div>

			<div class="modal-body">
			    <input type="hidden" id="user_del_name" v-model="user.name"/>
				Are you sure? <br />This object cannot be recovered after deletion.
			</div>

			<div class="modal-footer">
				<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-danger" @click="submit">Delete</button>
			</div>
		</div>
	</div>
</div>

<div class="modal fade" id="modal_user_add" data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">×</button>
				<h4 class="modal-title">User Add</h4>
			</div>

			<div class="modal-body">

				<div class="row">
					<div class="col-md-12">

						<div class="form-group">
							<label for="user_add_name" class="control-label">Name</label>
							<input
								type="text" class="form-control" v-model="user.name"
								placeholder="Name"/>
						</div>

					</div>
				</div>
				
				<div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label for="user_add_pwd" class="control-label">Password</label>
                            <input
                                type="password" class="form-control" v-model="user.password"
                                placeholder="Password"/>
                        </div>

                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <input
                                type="password" class="form-control" v-model="user.password2"
                                placeholder="Password"/>
                        </div>

                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label for="user_add_remark" class="control-label">Remark</label>
                            <input
                                type="text" class="form-control" v-model="user.tags"
                                placeholder="Remark"/>
                        </div>

                    </div>
                </div>
                
			</div>

			<div class="modal-footer">
				<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-success" @click="submit">Save</button>
			</div>
		</div>
	</div>
</div>

<div class="modal fade" id="modal_user_edit" data-backdrop="static">
	<div class="modal-dialog">
		<div class="modal-content">

			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">×</button>
				<h4 class="modal-title">User Edit</h4>
			</div>

			<div class="modal-body">

                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label for="user_edit_name" class="control-label">Name</label>
                            <input
                                type="text" class="form-control" v-model="user.name"
                                placeholder="Name" disabled="disabled"/>
                        </div>

                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label for="user_edit_pwd" class="control-label">Password</label>
                            <input
                                type="password" class="form-control" v-model="user.password"
                                placeholder="Password"/>
                        </div>

                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <input
                                type="password" class="form-control" v-model="user.password2"
                                placeholder="Password"/>
                        </div>

                    </div>
                </div>
                
                <div class="row">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label for="user_edit_remark" class="control-label">Remark</label>
                            <input
                                type="text" class="form-control" id="user_edit_remark" v-model="user.tags"
                                placeholder="Remark"/>
                        </div>

                    </div>
                </div>
                
            </div>

			<div class="modal-footer">
				<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-success" @click="submit">Edit</button>
			</div>
		</div>
	</div>
</div>
